<template>
  <div class="person">
    <h1 ref="title1">尚硅谷</h1>
    <h2 ref="title2">前端</h2>
    <h3 ref="title3">Vue</h3>
    <input type="text" ref="inpt" /> <br /><br />
    <button @click="showLog">点我打印内容</button>
  </div>
</template>

<script lang="ts" setup name="Person">
import { ref } from 'vue'

let title1 = ref()
let title2 = ref()
let title3 = ref()
let inpt = ref()

function showLog() {
  // 通过id获取元素
 

  // 通过ref获取元素
  console.log(title1.value)
  console.log(title2.value)
  console.log(title3.value)
  // inpt.value获取input节点
  console.log(inpt.value.value)
}
</script>
